@import "../../../style/root.scss";

.container {
    height: 100vh;
    // background-color: rgba(250, 250, 252, 1);
    background: rgba(0, 214, 121, 1);
}
.scroll{
    height: 100vh;
}
.container-block{
    @include padding-box(0rpx 30rpx 30rpx 30rpx);
}
.block-box{
    width: 690rpx;
    background: #FFFFFF;
    border-radius: 16rpx;
    @include padding-box(30rpx);
    margin-top: 30rpx;
}
.head{
    margin-top: 30rpx;
}
.head-box{
    background: #FAFAFC;
    border-radius: 12rpx;
    @include padding-box(30rpx);
    width: 300rpx;
}
.head-box-title{
    font-size: 24rpx;
}
.head-box-num{
    margin: 13rpx 0 20rpx 0;
}
.head-box-contrast{
    font-size: 24rpx;
    display: flex;
    align-items: center;
}
.block-box-date{
    border-radius: 8rpx;
    border: 1rpx solid #EAEAEF;
    background: #f4f4f7;
}
.block-box-date-type{
    width: 105rpx;
    text-align: center;
    @include padding-box(16rpx 27rpx);
}
.block-box-date-type-active{
    background: #ffffff;
    color: #202536;
    font-weight: bold;
}
.history-box{
    width: 690rpx;
    background: #FFFFFF;
    border-radius: 16rpx;
    margin-top: 30rpx;
}
.history-ornament{
    width: 100%;
    height: 1rpx;
    border-top: 1rpx solid #EAEAEF;
}
.sign-box{
    @include padding-box(30rpx);
    
}
.history-title{
    @include padding-box(30rpx);
}
.top-count{
    color: #565868;
}
.sign-list-i{
    @include padding-box(30rpx 30rpx);
}
.i-portrait-info{
    display: flex;
    align-items: center;
    .info-box{
        margin-left: 20rpx;
        .phone{
            margin-top: 10rpx;
        }
    }
}
.work-type{
    margin-top: 5rpx;
    text-align: right;
}
.work-type-green{
    color: $green;
}
.work-type-red{
    color: #FF7E68;
}
.work-type-grey{
    color: #C9CBD8;
}
.work-type-blue{
    color: #3E5FF5;
}
.work-type-yellow{
    color: #FFA548;
}
.triangle{
    margin-left: 9rpx;
}
.charts {
    width: 615rpx;
    height: 500rpx;
    background-color: #FFFFFF;
    margin-top: 30rpx;
}
.num-state{
    width: 14rpx;
    height: 18rpx;
}